<template>
<div class="container">
 <div class="card-list-wrapper" @click="handleClick">
    <div v-for="card in cardList" :key="card.title">
      <IndexCardVue :title="card.title" :imgUrl="card.imgUrl"></IndexCardVue>
    </div>
  </div>
</div>
</template>

<script setup>
import { ref } from "vue";
import IndexCardVue from "../components/Card/IndexCard.vue";
import { useRouter } from "vue-router";
const cardList = ref([
  {
    'title': '小红书',
    'imgUrl': 'https://upload.shejihz.com/wp-content/uploads/2020/04/0206757a4ae3ee2c01e298d2500fb83f.jpg'
  }
])
const router = useRouter()
const handleClick = () =>{
  router.push('/xhsDetail')
}
</script>

<style scoped>
.container{
  width: 100%;
  overflow-x: auto;
  box-sizing: border-box;
}
.card-list-wrapper{
  overflow-x: auto;
  height: 100vh;

}

</style>